// 返回顶部
var toTop = document.querySelector('.to-top')
var timer = null
window.onscroll = function (e) {
  var e = e || window.event;
  var a = document.body.scrollTop || document.documentElement.scrollTop
  // 大于500出现  小于就消失
  if (a > 500) {
    $('.to-top').show()
  } else {
    $('.to-top').hide()
  }
  // 小于0就等于0 ，结束定时器
  if (a <= 0) {
    clearInterval(timer)
    a = 0
  }
  toTop.onclick = function () {
    timer = setInterval(() => {
      a -= 20
      document.body.scrollTop = a
      document.documentElement.scrollTop = a
    }, 20);
  }
}


$("#zuce-button").click(function () {
  if ($("#zuce-button").text() == '注册') {
    $(".zuce").show()
  } else if ($("#zuce-button").text() == '退出') {
    removeCookie('username')
    $('.denglu-button').html(`<a href="./denglu.html">登录</a>`)
    $('#zuce-button').html(`<a href="javascript:;">注册</a>`)
  }
})



var index = layer.load(0, {
  shade: [1, '#fff']
});
var flag = true
var id = 1;
function loadHTML() {

  if (!flag) {
    return false
  }
  flag = false

  $.ajax({
    url: './php/shop-list.php',
    method: "post",
    data: {
      id: id,
      maxId: id + 11
    },
    success: function (res) {
      var { meta: { status, msg }, data } = res
      layer.close(index)
      if (status == 1) {
        console.log(data);
        for (var i = 0; i < data.length; i++) {
          var li = `
                    <li>
                    <img src="${data[i].imgpath.split('=====')[0]}" width="270">
                    <p class="p1"> ${data[i].name}</p>
                    <p class="p2">${data[i].introduce}</p>
                    <a class="goumai" href="shop.html?id=${data[i].id}">购买</a>
                    </li >
            `
          var minUl = getMinUl()
          minUl.innerHTML += li
        }
        id += 12
        flag = true
      }
    },
    error(xhr, err, msg) {

    },
    dataType: 'json',
  })
}
loadHTML()


function getMinUl() {
  // 遍历4个ul，看哪个最短
  var minUl = $('.water ul')[0]
  for (var j = 1; j < $('.water ul').length; j++) {
    if (minUl.offsetHeight > $('.water ul')[j].offsetHeight) {
      minUl = $('.water ul')[j]
    }
  }
  return minUl
}






$(window).scroll(function () {

  var t = document.body.scrollTop || document.documentElement.scrollTop

  var minUl = getMinUl()
  if (t - 40 + innerHeight > minUl.offsetHeight - 200) {
    console.log(111);
    loadHTML()
  }
})
















